<template>
    <div class="page attendance-set show-footerBtn">
        <template v-for="(index,workTime) in workTimeList">
            <div class="section bg-color">
                <div class="title-bar">
                    <h2>时段{{$index+1}}</h2>
                    <span class="bg_sprite btn_delete" v-if="$index != 0 && buttonIsShow" @click="deleteTime(index)"></span>
                </div>
                <div class="weui-cells">
                    <a class="weui-cell weui-cell_access" href="javascript:;" @click="selectStartTime(index)">
                        <div class="weui-cell__bd">
                            <p>开始时间</p>
                        </div>
                        <div class="weui-cell__ft" v-if="!buttonIsShow">{{workTime.start.time}}</div>
                        <div class="weui-cell__ft" v-else>{{workTime.start_time}}</div>
                    </a>
                    <a class="weui-cell weui-cell_access" href="javascript:;" @click="selectEndTime(index)">
                        <div class="weui-cell__bd">
                            <p>结束时间</p>
                        </div>
                        <div class="weui-cell__ft" v-if="!buttonIsShow">
                            <span v-if="workTime.cross == 1">次日</span>
                            {{workTime.end.time}}</div>
                        <div class="weui-cell__ft" v-else>
                            <span v-if="workTime.cross == 1">次日</span>
                            {{workTime.end_time}}</div>
                    </a>
                </div>
            </div>
        </template>
        
        <a class="btn_add bg-color com-border-bottom touch" href="javascript:;" @click="addWorkTime" v-if="buttonIsShow"><span>添加时段</span></a>
        <div class="btn-box bg-color fixed" :style="isIphoneX?'padding-bottom: 35px;':''" @click="submit">
            <a href="javascript:;" class="weui-btn weui-btn_primary">保存</a>
        </div>
    </div>
    
</template> 

<script>
    /**
     *  引入工具类库 或 Native API
     *  example : import widget from 'gapi/widget'
     */
    import commonPage from 'clientApi/commonPage.js'
    import widget from 'gapi/widget'
    /**
     *  引入组件 以及 组件接口(Action)
     *  example : import Somecomponents from 'components/Somecomponents/Somecomponents'
     */

    let isdisabled = ''
    import * as util from 'js/util.js'
    import cache from 'gapi/cache.js'
    import clientUi from 'gapi/clientUi.js'
    /**
     *  组件实例对象
     */
    export default {
        components: {
            
        },
        data: function(){
            return{
                buttonIsShow: true,
                workTimeList: [],
            }
        },
        computed:{
            isIphoneX: function(){
                return util.isIphoneX()
            }
        },
        vuex: {
            getters: {

            },
            actions: {

            }
        },
        methods: {
            /**
             * 初始化
             * @method init
             * @public
             * @return {Null} void
             */
            init (){
                cache.getMemoryCache('workTimeRange', (data) => {
                    if(data){
                        this.workTimeList=data
                    }else{
                        //设置默认值
                        let  workTime = {
                                'start_time':'09:00',
                                'end_time':'18:00',
                                'cross' : 0
                            }
                        this.workTimeList.push(workTime)
                    }
                })
                
                isdisabled = util.getUrddataString('isdisabled')
                if(isdisabled&&isdisabled == 555){
                    this.buttonIsShow = false
                }else{
                    this.buttonIsShow = true
                }
            },
            addWorkTime(){
                if(this.workTimeList.length<3){
                    let  workTime = {
                        'start_time':'09:00',
                        'end_time':'18:00',
                        'cross' : 0
                    }
                    this.workTimeList.push(workTime)
                }else{
                    widget.toast('最多添加3个时段')
                }
            },
            selectStartTime(index){
                let endTimeList = ''
                let endTimeSs = ''
                // console.log(this.workTimeList[index].end.time)
                if(!this.buttonIsShow){
                    endTimeList = this.workTimeList[index].end.time.split(':')
                    endTimeSs = (Number(endTimeList[0])-1)+":"+endTimeList[1]
                }else{
                    console.log(this.workTimeList[index].end_time)
                    endTimeList = this.workTimeList[index].end_time.split(':')
                    endTimeSs = (Number(endTimeList[0])-1)+":"+endTimeList[1]
                    console.log(endTimeList)
                }
                console.log(endTimeSs)
                /**
                 * @param  {[title]}
                 * @param  {[开始时间]}
                 * @param  {[结束时间]}
                 * @param  {[回调方法]}
                 * @return {data.status： // 0 取消， 1 确定
                 *          data.selectedTime： // 用户选择的时间 '6:40'
                 *         }
                 */
                // clientUi.showTimePicker("开始时间", "00:00", endTimeSs, (data) => {
                clientUi.showTimePicker("开始时间", "00:00", "23:55", (data) => {
                    if(data.status==1){
                        
                        if(!this.buttonIsShow){
                            if(this.compareTime3(data.selectedTime,this.workTimeList[index].end.time) == 1){
                                this.workTimeList[index].cross = 1
                                this.workTimeList[index].end.time = this.workTimeList[index].end.time

                            }else if(this.compareTime3(data.selectedTime,this.workTimeList[index].end.time) == 0){
                                widget.toast('开始和结束时间不可相同')
                                return
                            }else{         
                                this.workTimeList[index].cross = 0
                                this.workTimeList[index].end.time = this.workTimeList[index].end.time
                            }
                            this.workTimeList[index].start.time = data.selectedTime
                        }else{
                            if(this.compareTime3(data.selectedTime,this.workTimeList[index].end_time) == 1){
                                this.workTimeList[index].cross = 1
                                this.workTimeList[index].end_time = this.workTimeList[index].end_time

                            }else if(this.compareTime3(data.selectedTime,this.workTimeList[index].end_time) == 0){
                                widget.toast('开始和结束时间不可相同')
                                return
                            }else{
                                this.workTimeList[index].cross = 0
                                this.workTimeList[index].end_time = this.workTimeList[index].end_time
                            }
                            this.workTimeList[index].start_time = data.selectedTime
                        }
                    }

                })
                

            },
            selectEndTime(index){
                let startTimeListSe = ''
                let startTimeSe = ''
                if(!this.buttonIsShow){
                    startTimeListSe = this.workTimeList[index].start.time.split(':')
                    startTimeSe = (Number(startTimeListSe[0])+1)+":"+startTimeListSe[1]
                }else{
                    startTimeListSe = this.workTimeList[index].start_time.split(':')
                    startTimeSe = (Number(startTimeListSe[0])+1)+":"+startTimeListSe[1]
                }
                
                clientUi.showTimePicker("结束时间", "00:00", "23:55", (data) => {
                // clientUi.showTimePicker("结束时间", startTimeSe, "23:55", (data) => {
                    if(data.status==1){
                      
                        if(!this.buttonIsShow){
                            if(this.compareTime3(this.workTimeList[index].start.time,data.selectedTime) == 1){
                                this.workTimeList[index].cross = 1
                                this.workTimeList[index].end.time = data.selectedTime

                            }else if(this.compareTime3(this.workTimeList[index].start.time,data.selectedTime) == 0){
                                widget.toast('开始和结束时间不可相同')
                                return
                            }else{            
                                this.workTimeList[index].cross = 0
                                this.workTimeList[index].end.time = data.selectedTime
                            }
                            // this.workTimeList[index].end.time = data.selectedTime
                        }else{
                            if(this.compareTime3(this.workTimeList[index].start_time,data.selectedTime) == 1){
                                this.workTimeList[index].cross = 1
                                this.workTimeList[index].end_time = data.selectedTime

                            }else if(this.compareTime3(this.workTimeList[index].start_time,data.selectedTime) == 0){
                                widget.toast('开始和结束时间不可相同')
                                return
                            }else{
                                this.workTimeList[index].cross = 0
                                this.workTimeList[index].end_time = data.selectedTime
                            }
                            // this.workTimeList[index].end_time = data.selectedTime
                        }
                    }
                    
                })

            },
            submit(){

                let len = this.workTimeList.length
                if(len>0){
                    if(!this.buttonIsShow){
                        for(let i=0; i<len-1;i++){
                            if(this.workTimeList[i].cross == 1 || (this.compareTime3(this.workTimeList[i+1].start.time,this.workTimeList[i].end.time)!=1)){
                                widget.toast('后一时间段开始时间必须在上一时间段之后')
                                return 
                            }
                        }
                        cache.getMemoryCache('webViewID',(data)=>{
                            if(data){
                              commonPage.goBack(1,{'key':'workTimeRange','value':this.workTimeList},data.webViewID)
                            }
                        })
                    }else{
                        for(let i=0; i<len-1;i++){
                            if(this.workTimeList[i].cross == 1 || (this.compareTime3(this.workTimeList[i+1].start_time,this.workTimeList[i].end_time)!=1)){
                                widget.toast('后一时间段开始时间必须在上一时间段之后')
                                return 
                            }
                        }
                        cache.getMemoryCache('webViewID',(data)=>{
                            if(data){
                                let reg=/[\u4E00-\u9FA5]/g;
                                this.workTimeList.forEach((obj) => {
                                    obj.end_time = obj.end_time.replace(reg,'')
                                })
                                commonPage.goBack(1,{'key':'workTimeRange','value':this.workTimeList},data.webViewID)
                            }
                        })
                    }
                    
                }else{
                    widget.toast('请添加固定时段')
                }
                
            },
            /**
             * 比较时间大小
             * @param  {[＊＊:＊＊]} a [时间]
             * @param  {[＊＊:＊＊]} b [时间]
             * @return {[－1,0,1]}   [a<b,a==b,a>b]
             */
            compareTime(a,b){
                let timeA = a.split(":")
                let timeB = b.split(":")
                if(timeA[0]>timeB[0]){
                    return 1
                }else if(timeA[0]==timeB[0]){
                    if(timeA[1]>timeB[1]){
                        return 1
                    }else if(timeA[1]==timeB[1]){
                        return 0
                    }else{
                        return -1
                    }
                }else{
                    return -1
                }
            },
            compareTime3(a,b){
                let timeA = a.split(":")
                let timeB = b.split(":")
                if(parseInt(timeA[0])>parseInt(timeB[0])){
                    return 1
                }else if(parseInt(timeA[0])==parseInt(timeB[0])){
                    if(parseInt(timeA[1])>parseInt(timeB[1])){
                        return 1
                    }else if(parseInt(timeA[1])==parseInt(timeB[1])){
                        return 0
                    }else{
                        return -1
                    }
                }else{
                    return -1
                }
            },
            deleteTime(index){
                this.workTimeList.splice(index, 1)
            }
        },
        created(){

            this.init()
        }
        
    }

    
</script>

<!-- CSS 样式 -->
<style src="../../node_modules/weui/dist/style/weui.css"></style>
<style src="../../static/css/common.css"></style>
<style src="../../static/css/attendance-set.css"></style>
<style>
    .btn-wrap{
        padding: 15px;
    }
    .link{
            font-size: 12px;
            color: blue;
            text-align: right;
    }
</style>



